<template lang="pug">
  FullScreenDialog(ref="dialog")
    template(v-slot:header)
      v-toolbar(dark, color='primary')
        v-btn(icon, dark, @click='cancel')
          v-icon close
        v-toolbar-title {{ title }}
        v-spacer
        v-toolbar-items
    template(v-slot:default)
      transition(name='bounceUp', mode='out-in')
        keep-alive
          component(
            style="animation-duration: 0.3s"
            ref="childCmp"
            :is='view'
            :order="order"
            @toggleModel="onToggleModel"
          )
</template>
<script lang="ts">
  import Vue, {VueConstructor} from 'vue'
  import FullScreenDetailsMixin from '@/components/mixins/FullScreenDetailsMixin'
  import FullScreenDialog from '@/components/widgets/dialog/FullScreenDialog.vue'
  import OrderForm from './order_form'
  import OrderView from './order_view'
  export default (Vue as VueConstructor<Vue & {

  }>).extend({
    mixins: [FullScreenDetailsMixin],
    components: {OrderForm, OrderView, FullScreenDialog},
    name: 'order_details',
    props: ['order'],
    methods: {
    },
    computed: {
      needRefresh() {
        return true
        // return this.order.id && this.isNew
      },
      view() {
        return this.isViewModel ? OrderView : OrderForm
      }
    },
    data() {
      return {}
    }
  })
</script>